function $(id) {
return document.getElementById(id)
}
window.onload = function () {
    showBookInfo(booksArray)
}

/***
 * 显示书籍信息
 * @param booksArray 书籍数组
 */
function showBookInfo(booksArray) {
  let str =""
  booksArray.forEach(n =>{
     str +=`<tr onclick="trClivk(this,${n.code})" n><td>${n.name}</td><td>${n.author}</td><td>${n.price}</td></tr>`
  })
  $('bookDate').innerHTML = str
}

/***
 * 单击变色
 * @param trObj
 */
let colorTr = null
function trClivk(trObj,bookCode) {
   if(colorTr != null){
     colorTr.style.backgroundColor="white"
   }
   trObj.style.backgroundColor="red"
   colorTr = trObj

  //得到id所对应的对象
  let bookObj =booksArray.find(n =>n.code==bookCode)
  $('idSpan').innerHTML=bookObj.code
  $('bookSpan').innerHTML=bookObj.name
  $('priceSpan').innerHTML=bookObj.price
  $("auSpan").innerHTML = bookObj.author
  $('bookImg').src ="photo/"+bookObj.imgPath
}

/***
 * 查询书籍
 */
function findBook() {
 let obj = booksArray.filter(n => n.name.indexOf($('serch').value) != -1)
  showBookInfo(obj)
}
